/*
 * @Title: 申诉模块
 * @Created by: gsjPC 
 */
<template>
	<view class="shensuBody">
		<comHeader :config="navConfig"/>
		<view style="width: 100%;height: 120upx;background: #FFFFFF;"></view>
		<view class="shensu-body">
			<view class="shenshu-box">
				<text class="shenshu-label">身份证号</text>
				<input type="text" placeholder="请输入个人身份证号">
			</view>
			<view class="line"></view>
			<view class="shenshu-box">
				<text class="shenshu-label">银行卡号</text>
				<input type="text" class="bankNum" placeholder="输入曾绑定的银行卡号">
				<image src="/static/xiangji.png" mode=""></image>
			</view>
			<view class="line"></view>
			<view class="shenshu-box ssyh">
				<view>
					<text class="shenshu-label">所属银行</text>
					<text class="bank">中国工商银行</text>
				</view>
				<!-- #ifdef APP-PLUS|| MP-WEIXIN -->
				<uni-icon type="arrowright"  size="20" color="rgba(220,220,220,1.00)" style='margin-top: -10upx;float: right;'></uni-icon>
				<!-- #endif -->
				<!-- #ifndef APP-PLUS|| MP-WEIXIN -->
				<uni-icon type="arrowright"  size="20" color="rgba(220,220,220,1.00)" style='padding-top: 34upx;float: right;'></uni-icon>
				<!-- #endif -->
			</view>
		</view>
		<text class="out-label"> 曾绑关系（至少选填一项）</text>
		<view class="shensu-body">
			<view class="shenshu-box">
				<text class="shenshu-label">手机号</text>
				<input type="text" placeholder="曾绑定的手机号">
			</view>
			<view class="line"></view>
			<view class="shenshu-box">
				<text class="shenshu-label">邮箱号</text>
				<input type="text" placeholder="曾绑定的邮箱号">
				<image src="" mode=""></image>
			</view>
			
		</view>
		<view class="shensu-body">
			<view class="shenshu-box">
				<text class="shenshu-label">可用手机号</text>
				<input type="text" placeholder="请输入现可用手机号">
			</view>
		</view>
		<view class="nextStep" @tap="nextStep">下一步</view>
	</view>
	
</template>

<script>
	import uniIcon from '@/components/uni-icon/uni-icon'
	export default{
		data(){
			return{
				navConfig:{
					isFixed:false,
					left:{
						text:'',  
						isShowLeft:true,
						leftGobackColor:'black',
						leftTextColor:'black',
					},
					mid:{
						isShowMid:true,
						text:'申诉找回账号密码'
					},
					right:{
						text:'',
						isShowRight:false,
					}
				}
			}
		},
		methods:{
			nextStep(){
				uni.navigateTo({
					url:'/pages/login/shenSu3'
				})
			}
		},
		components:{
			uniIcon
		}
	}
</script>

<style>
	.shensuBody{
		background: rgba(246,246,246,1.00);
		top: 0;
		width: 100%;
		overflow: hidden;
		height: 100vh;
		
	}
	.nextStep{
		width: 612upx;
		margin-left: auto;
		margin-right: auto;
			height: 88upx;
			line-height: 88upx;
			border-radius:88upx;
			font-size: 28upx;
			background: linear-gradient(left,#54AAFF,#568FFF);
			text-align: center;
			color: #ffffff;
			margin-top:110upx;
	}
	.shensu-body{
		width: 750upx;
		height: auto;
		display: table;
		background: #FFFFFF;
		border-top: rgba(246,246,246,1.00) solid 15upx;
		/* margin-top: 140upx; */
	}
	
	.shenshu-box{
		width: 690upx;
		margin-left: auto;
		margin-right: auto;
		height: 100upx;
	}
	.line{
		width: 690upx;
		height: 1px;
		margin-left: auto;
		margin-right: auto;
		background: rgba(220,220,220,1.00);
	}
	.shenshu-label{
		width: 150upx;
		height: 100upx;
		line-height: 100upx;
		font-size: 28upx;
		float: left;
	}
	.shenshu-box input{
		width: 300upx;
		height: 100upx;
		line-height: 100upx;
		font-size: 28upx;
		margin-left: 90upx;
		float: left;
	}
	.shenshu-box image{
		width: 39upx;
		height: 32upx;
		float: right;
		margin-top: 34upx;
	}
	.shenshu-box uni-icon{
		float: right;
		margin-top: 34upx;
	}
	.bank{
		color: rgba(0,9,100,1.00);
		width: 300upx;
		height: 100upx;
		display: block;
		line-height: 100upx;
		font-size: 28upx;
		margin-left: 90upx;
		float: left;
	}
	.out-label{
		width: 750upx;
		padding-left: 30upx;
		padding-right: 30upx;
		height: 80upx;
		display: block;
		line-height: 100upx;
		background: ;
		font-size: 28upx;
		background: rgba(246,246,246,1.00);
	}
	.ssyh{
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}
</style>
